<template>
	<view class="content">
		<web-view id="wv" @message="message" :src="src"></web-view>
		
		
		<bgyx-tab-bar />
	</view>


</template>

<script>
	import config from '../../config.js'
	import {
		mapState
	} from 'vuex';
	import {
		pub,sub,unsub
	} from '../../common/event';
	import moment from 'moment/moment';
	export default {
		data() {
			return {
				name: '',
				id: '',
				wv: '',
				src:'',
				typemode:'',
				applylist:[],
				lmuser:[],
				aaa:true
			}
		},
		components: {

		},
		computed: {
			...mapState({
				info:function(state){
					return state.friend.list.find(e=>e.fid == this.id)
				}
			})
		},
		onBackPress(options) {
			console.log(147, options)
			if (options.from && options.from == 'backbutton' && this.typemode == 'start') {
				return true
			}
			return false
		},
		onUnload() {
			this.sendMessage({
				type:"backpress",
				data:{}
			})
			
			this.$store.commit(`common/setStatus`,'normal')
			unsub("socket_touser_applylm",this.applylm)
			unsub("socket_touser_closeapplylm",this.closeapplylm)
			unsub("socket_touser_closeapplylmx",this.closeapplylmx)
			unsub("socket_liveroomlmenter",this.liveroomlmenter)
			const user = this.$store.state.user.user
			unsub(`socket_lmuserchangeinfo_${user.id}`,this.lmuserchangeinfo)
			this.$u.put(`chat/chat/stopliveroom`)
			try {
				if(this.sit){
					clearInterval(this.sit)
				}
				if (this.tempvd && this.tempvd.stream) {
					this.tempvd.unpublish()
				}
				if (this.myvddata && this.myvddata.stream) {
					this.myvddata.unpublish()
				}
			} catch (e) {
				//TODO handle the exception
			}
		},
		onLoad() {
			sub("socket_touser_applylm",this.applylm)
			sub("socket_touser_closeapplylm",this.closeapplylm)
			sub("socket_touser_closeapplylmx",this.closeapplylmx)
			sub("socket_liveroomlmenter",this.liveroomlmenter)
			
			const user = this.$store.state.user.user
			sub(`socket_lmuserchangeinfo_${user.id}`,this.lmuserchangeinfo)
			this.$store.commit(`common/setStatus`,'videocall')
			const fileurl = this.$store.state.common.systemInfo.fileurl;
			const upurl = config.hostUrl;
			
			this.src = `/hybrid/html/liveroom.html?uid=${user.id}&fileurl=${encodeURIComponent(fileurl)}&upurl=${encodeURIComponent(upurl)}`
			setTimeout(() => {
				if (!this.wv) {
					let currentWebview = this.$scope.$getAppWebview();
					this.wv = currentWebview.children()[0]
				}
			}, 2000)
			
		},
		onReady() {
			setTimeout(() => {
				let currentWebview = this.$scope.$getAppWebview();
				this.wv = currentWebview.children()[0]
			}, 500)
		},
		methods: {
			lmuserchangeinfo: async function(e){
				this.sendMessage({
					type:"lmuserchangeinfo",
					data:e
				})
				
			},
			agree:async function(item){
				item.applystatus = "agree"
				this.$socket.send({
					type:"touser_applyret_agree",
					data:{to:{id:item.id}}
				})
			},
			refuse:async function(item){
				item.applystatus = "refuse"
				this.$socket.send({
					type:"touser_applyret_refuse",
					data:{to:{id:item.id}}
				})
			},
			kicklmuser:async function(item){
				
				const user = this.$store.state.user.user
				this.$u.put(`chat/chat/removelmuser/${user.id}`,item)
			},
			applylm: async function(e){
				// e.applystatus = 'applying'
				// this.applylist.push(e)
				this.sendMessage({
					type:"socket_touser_applylm",
					data:e
				})
			},
			liveroomlmenter: async function(e){
				this.sendMessage({
					type:"liveroomlmenter",
					data:e
				})
				
				
			},
			closeapplylm: async function(e){
				
				this.sendMessage({
					type:"closeapplylm",
					data:e
				})
				
			},
			closeapplylmx: async function(e){
				
				this.sendMessage({
					type:"closeapplylmx",
					data:e
				})
				
				
			},
			changecamera: async function() {
				let videoType = this.myvddata.videoType
				if (videoType == "face") {
					videoType = "environment"
				} else {
					videoType = "face"
				}
				try {
					await this.myvddata.unpublish()
					this.publishStream({
						videoType,
						video: this.myvddata.video,
						audio: this.myvddata.audio,
					})
				} catch (e) {
					//TODO handle the exception
				}
			},
			changeaudio: async function(e) {
				this.myvddata.muteAudio(e)
				this.myvddata.audio = e
				await this.$u.put(`chat/chat/liveroomchange`, {
					audio: e,
					video:this.myvddata.video
				})
			},
			changevideo: async function(e) {
				this.myvddata.muteVideo(e)
				this.myvddata.video = e
				await this.$u.put(`chat/chat/liveroomchange`, {
					video: e,
					audio:this.myvddata.audio
				})
			},
			exit: async function(e) {
				this.$store.commit(`common/setStatus`,'normal')
				await this.$u.put(`chat/chat/stopliveroom`)
				uni.navigateBack()
			},
			uploadimg: async function(e) {
				const _this = this
				uni.chooseImage({
					count: 1,
					async success(res) {
						console.log(res)
						const path = res.tempFilePaths[0]
						const ret = await utils.uploadImage(path)
						console.log(ret)
						_this.picture = ret.data.pathname
					}
				})
			},
			start: async function() {
				if (!this.picture) {
					uni.showToast({
						title: "请选择封面图",
						icon: "none"
					})
					return
				}
			
				const user = this.$store.state.user.user
				const data = {
					picture: this.picture,
					name: this.name ? this.name : (user.name + "的直播间"),
					uid: user.id,
					time: moment().valueOf(),
					password: this.password
				}
			
				const ret = await this.$u.post(`chat/chat/startliveroom`, data)
			
				this.typemode = 'start'
			
				this.publishStream({
					video: true,
					audio: true,
					videoType: 'face'
				})
			
			
			},
			sendMessage(data) {
				const message = JSON.stringify(data)
				if (!this.wv) {
					let currentWebview = this.$scope.$getAppWebview();
					this.wv = currentWebview.children()[0]
				}
				this.wv.evalJS(`vm.onMessage(${message})`);
			},
			message: async function(e) {
				if(e && e.detail && e.detail.data && e.detail.data.length > 0){
					const user = this.$store.state.user.user
					const message = e.detail.data[0]
					console.log(111,message)
					if(message.type == "startdone"){
						if (!message.data.picture) {
							uni.showToast({
								title: "请选择封面图",
								icon: "none"
							})
							return
						}
						
						uni.showLoading({
							title:"直播开始.."
						})
						
						const user = this.$store.state.user.user
						const data = {
							picture: message.data.picture,
							name: message.data.name ? message.data.name : (user.name+"的直播间"),
							uid:user.id,
							time: moment().valueOf(),
							password:message.data.password
						}
						
						const ret = await this.$u.post(`chat/chat/startliveroom`,data)
						
						this.sendMessage({
							type:"livestart",
							data:{
								room:ret.data,
								uid:user.id,
								srsUrl:config.srsUrl,
								ip:config.ip,
							}
						})
						
						setTimeout(()=>{
							uni.hideLoading()
						},3000)
					}
					
					
					if(message.type == "mutevideo"){
						await this.$u.put(`chat/chat/liveroomchange`,{
							audio:message.data.audio,
							video:message.data.video,
						})
					}
					
					if(message.type == "muteaudio"){
						await this.$u.put(`chat/chat/liveroomchange`,{
							audio:message.data.audio,
							video:message.data.video,
						})
					}
					
					if(message.type == "exit"){
						this.exit()
					}
					
					if(message.type == "agree"){
						this.agree(message.data)
					}
					
					if(message.type == "refuse"){
						this.refuse(message.data)
					}
					
					if(message.type == "kicklmuser"){
						this.kicklmuser(message.data)
					}
					
					
				}
			},
		}
	}
</script>


<style scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		height: 100vh;
		overflow-y: hidden;
		padding-bottom: 120rpx;
		border-start-end-radius: 32rpx;
		border-start-start-radius: 32rpx;
	}
</style>